import * as echarts from "echarts";

function generate_option_tooltip(item_data, unit) {
    let formatter = '';

    for (let i = 0; i < item_data.length; i++) {
        if (i > 0) {
            formatter += '<br />';
        }

        formatter += ('{a' + i + '}： {c' + i + '}' + unit);
    }

    let option_tooltip = {
        trigger: 'axis',
        formatter: formatter,
    };

    return option_tooltip;
}

function generate_option_legend(legend_data) {
    let option_legend = null;

    if (legend_data.length > 1) {
        option_legend = {
            data: legend_data,
        }
    }

    return option_legend;
}

function generate_option_xaxis(item_type, item_list) {
    let option_xaxis = {
        type: 'category',
        axisTick: { show: false },
        data: item_list,
        axisLabel: { formatter: '{value}' },
    };

    if (item_type === 'timeline_sec') {
        option_xaxis.axisLabel = {
            formatter: (value, i) => {
                let min = Math.floor(value / 60) > 9 ? Math.floor(value / 60) + '' : '0' + Math.floor(value / 60);
                let secd = value % 60 > 9 ? value % 60 + '' : '0' + value % 60;
                return min + ':' + secd
            }
        }
    }

    return option_xaxis;
}

function generate_option_yaxis(option) {
    let option_yaxis = {
        min: option.user_defined_y ? option.min : null,
        max: option.user_defined_y ? option.max : null,
        interval: option.user_defined_y ? option.interval : null,
        axisLabel: {
            formatter: '{value}' + option.unit,
        }
    };

    return option_yaxis;
}

function generate_option_data_zoom() {
    let option_data_zoom = [
        {
            id: 'dataZoomX',
            type: 'slider',
            filterMode: 'filter',
        }
    ];
    return option_data_zoom;
}

function generate_option_series_color(color_buttom, color_top) {
    let option_color = {
        type: 'linear',
        x: 0,
        y: 0,
        x2: 0,
        y2: 1,
        colorStops: [
            { offset: 0, color: color_buttom },
            { offset: 1, color: color_top }
        ],
        global: false
    };

    return option_color;
}

function generate_bar_chart_option_series(data, unit) {
    let option_series = [];

    for (let data_item of data) {
        let option = {
            type: 'bar',
            name: data_item.name,
            data: data_item.list,
            label: {
                show: true,
                position: 'top',
                formatter: '{c}' + unit,
            },
            itemStyle: {
                color: generate_option_series_color(data_item.color_buttom, data_item.color_top)
            },
            emphasis: { focus: 'series' },
            barWidth: 16
        };

        option_series.push(option);
    }

    return option_series;
}

function generate_line_charts_option_series(item_list) {
    let option_series = [];

    for (let data_item of item_list) {
        let def_option = {
            type: 'line',
            smooth: true,
            name: data_item.name,
            data: data_item.list,
            areaStyle: null,
        };

        let area_style = {
            color: generate_option_series_color('#2D80FF', 'rgba(54,109,228,0.00)')
        };

        if (item_list.length === 1)
            def_option.areaStyle = area_style;
        option_series.push(def_option);
    }

    return option_series;
}

export function echarts_generate_bar_chart_option(item_list, item_data, option_y) {
    let legend_data = [];
    for (let data of item_data) {
        legend_data.push(data.name);
    }

    let option = {
        tooltip: generate_option_tooltip(item_data, option_y.unit),
        legend: generate_option_legend(legend_data),
        grid: { left: '6%' },
        xAxis: generate_option_xaxis('default', item_list),
        yAxis: generate_option_yaxis(option_y),
        series: generate_bar_chart_option_series(item_data, option_y.unit),
    };

    return option;
}

export function echarts_generate_line_chart_option(item_list, option_y) {
    let legend_data = [];
    for (let item of item_list) {
        legend_data.push(item.name);
    }

    let xaxis_list = [];
    for (let i = 0; i < item_list[0].list.length; i++) {
        xaxis_list.push(i);
    }

    let option = {
        tooltip: generate_option_tooltip(item_list, option_y.unit),

        legend: generate_option_legend(legend_data),
        grid: { left: '6%' },
        xAxis: generate_option_xaxis('timeline_sec', xaxis_list),
        yAxis: generate_option_yaxis(option_y),
        series: generate_line_charts_option_series(item_list),
        dataZoom: generate_option_data_zoom(),
    };

    return option;
}

export function echarts_connect_charts(group) {
    echarts.connect('report');
}